<template>
	<view>
		<view class="top-view">
			<uni-header title="订单详情" background="" :border="false" color="#fff"></uni-header>
			<view class="status-view flex-row-center" :style="{ paddingTop: $statusBarHeight() + 50 + 'px' }">
				<image :src="$getImgUrl('mine/ic_dd_dfk.png')" mode="widthFix"></image>

				<text v-if="detail.status == 0">待付款</text>
				<text v-if="detail.status == 1">待发货</text>
				<text v-if="detail.status == 2">已发货</text>
				<text v-if="detail.status == 3">已完成</text>
			</view>
		</view>

		<view class="address-view flex-row-center">
			<image :src="$getImgUrl('mine/weizhi.png')" mode="widthFix" class="img-loc"></image>
			<view class="address-view-info">
				<view class="name">
					<text>{{ detail.username }}</text>
					{{ detail.phone }}
				</view>
				<view class="city">{{ detail.address }}</view>
			</view>
		</view>
		<view class="line" v-if="detail.pay_status == 2"></view>
		<view
			class="address-view flex-row-center"
			style="margin-top: 10rpx;"
			v-if="detail.status == 2"
			@click="
				$navTo('pages/mine/logistics/logistics', {
					orderId: detail.id,
					type: 1
				})
			"
		>
			<!-- <image src="../../../static/images/mine/ys.png" mode="widthFix" class="img-ys"></image> -->
			<view class="address-view-info">
				<view class="name yunshu">包裹正在努力运输中，请耐心等待</view>
				<view class="city">{{ detail.create_at }}</view>
			</view>
			<!-- <image src="../../../static/images/mine/gd.png" mode="widthFix" class="img-jiantou"></image> -->
		</view>

		<view class="order-item">
			<view class="order-item-goods flex-row-center">
				<image :src="detail.img" class="goods-img" mode="aspectFill"></image>
				<view class="goods-right flex-col">
					<view class="goods-right-title ellipsis-2">{{ detail.name }}</view>
					<view class="price-view flex-row-between">
						<view class="text-price">
							￥
							<text>{{ detail.price }}</text>
						</view>
						<view class="goods-right-num">x{{ detail.num }}</view>
					</view>
				</view>
			</view>

			<view class="order-money-view">
				<view class="order-item-bottom flex-row-center one-title">
					<view class="baoyou">商品合计</view>
					<view class="all-price">￥{{ detail.price }}</view>
				</view>
				<view class="order-item-bottom flex-row-center">
					<view class="baoyou">运费</view>
					<view class="all-price">¥0.00</view>
				</view>
			</view>
			<view class="order-money-view" style="padding-top: 0;">
				<view class="line"></view>
				<view style="height: 20rpx"></view>
				<view class="order-item-bottom flex-row-center one-title">
					<view class="baoyou">应付金额</view>
					<view class="all-price" style="color: #FD1B1B">￥{{ detail.allprice }}</view>
				</view>
			</view>
		</view>

		<view class="order-time-view">
			<view class="order-num flex-row-center">
				<text>订单编号</text>
				<text class="id">{{ detail.orderid }}</text>
				<text class="copy" @click="onCopy">复制</text>
			</view>
			<view class="order-num flex-row-center">
				<text>购买时间</text>
				<text class="id">{{ detail.create_at }}</text>
			</view>
		</view>

		<view style="height: 98rpx;"></view>
		<view class="bottom-fixed flex-row-center" v-if="detail.status == 0 || detail.status == 2">
			<view class="order-btn cancel-btn" @click.stop="onCancel" v-if="detail.status == 0">取消订单</view>
			<view class="order-btn" @click.stop="onPay" v-if="detail.status == 0">去付款</view>
			<view class="order-btn" @click.stop="onShouhuo" v-if="detail.status == 2">确认收货</view>
		</view>
		<show-modal></show-modal>
	</view>
</template>

<script src="./store-detail.js"></script>

<style lang="scss">
@import '@/style/common.scss';
@import '../../mine/order/order.scss';
@import './store-detail.scss';
</style>
